﻿<div class="settings-panel">
	<div class="mt-4 d-table w-100 px-5">
		<div class="d-table-cell align-middle">
			<h5 class="p-0">
				应用布局
			</h5>
		</div>
	</div>
	<div class="list" id="fh">
		<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
			data-class="header-function-fixed"></a>
    <span class="onoffswitch-title">固定标题栏</span>
    <span class="onoffswitch-title-desc">标题栏任何时候都是固定的</span>
	</div>
	<div class="list" id="nff">
		<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
			data-class="nav-function-fixed"></a>
		<span class="onoffswitch-title">固定导航栏</span>
    <span class="onoffswitch-title-desc">左侧面板固定</span>
	</div>
	<div class="list" id="nfm">
		<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
			data-class="nav-function-minify"></a>
		<span class="onoffswitch-title">缩小导航栏</span>
    <span class="onoffswitch-title-desc">缩小导航以最大化空间</span>
	</div>
	<div class="list" id="nfh">
		<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
			data-class="nav-function-hidden"></a>
		<span class="onoffswitch-title">隐藏导航栏</span>
    <span class="onoffswitch-title-desc">滚动鼠标在边缘上显示</span>
	</div>
	<div class="list" id="nft">
		<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle"
			data-class="nav-function-top"></a>
		<span class="onoffswitch-title">导航栏置顶</span>
    <span class="onoffswitch-title-desc">将左窗格重新定位到顶部</span>
	</div>
	<div class="list" id="mmb">
		<a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-main-boxed"></a>
    <span class="onoffswitch-title">盒装的布局</span>
    <span class="onoffswitch-title-desc">封装到容器中</span>
	</div>
	 
	<div class="mt-2 d-table w-100 pl-5 pr-3">
		<div class="d-table-cell align-middle">
			<h5 class="p-0">
				主题颜色
			</h5>
		</div>
	</div>
    <div class="expanded theme-colors pl-5 pr-3">
        <ul class="m-0">
            <li>
                <a href="#"
                   id="myapp-0"
                   data-action="theme-update"
                   data-themesave
                   data-theme="/Content/css/themes/cust-theme-0.css"
                   data-toggle="tooltip"
                   data-placement="top"
                   title="Wisteria (base css)"
                   data-original-title="Wisteria (base css)"></a>
            </li>
            <li>
                <a href="#"
                   id="myapp-1"
                   data-action="theme-update"
                   data-themesave
                   data-theme="/Content/css/themes/cust-theme-1.css"
                   data-toggle="tooltip"
                   data-placement="top"
                   title="Tapestry"
                   data-original-title="Tapestry"></a>
            </li>
            <li>
                <a href="#"
                   id="myapp-2"
                   data-action="theme-update"
                   data-themesave
                   data-theme="/Content/css/themes/cust-theme-2.css"
                   data-toggle="tooltip"
                   data-placement="top"
                   title="Atlantis"
                   data-original-title="Atlantis"></a>
            </li>
            <li>
                <a href="#"
                   id="myapp-3"
                   data-action="theme-update"
                   data-themesave
                   data-theme="/Content/css/themes/cust-theme-3.css"
                   data-toggle="tooltip"
                   data-placement="top"
                   title="Indigo"
                   data-original-title="Indigo"></a>
            </li>
            <li>
                <a href="#"
                   id="myapp-4"
                   data-action="theme-update"
                   data-themesave
                   data-theme="/Content/css/themes/cust-theme-4.css"
                   data-toggle="tooltip"
                   data-placement="top"
                   title="Dodger Blue"
                   data-original-title="Dodger Blue"></a>
            </li>
            <li>
                <a href="#"
                   id="myapp-5"
                   data-action="theme-update"
                   data-themesave
                   data-theme="/Content/css/themes/cust-theme-5.css"
                   data-toggle="tooltip"
                   data-placement="top"
                   title="Tradewind"
                   data-original-title="Tradewind"></a>
            </li>
            <li>
                <a href="#"
                   id="myapp-6"
                   data-action="theme-update"
                   data-themesave
                   data-theme="/Content/css/themes/cust-theme-6.css"
                   data-toggle="tooltip"
                   data-placement="top"
                   title="Cranberry"
                   data-original-title="Cranberry"></a>
            </li>
            <li>
                <a href="#"
                   id="myapp-7"
                   data-action="theme-update"
                   data-themesave
                   data-theme="/Content/css/themes/cust-theme-7.css"
                   data-toggle="tooltip"
                   data-placement="top"
                   title="Oslo Gray"
                   data-original-title="Oslo Gray"></a>
            </li>
            <li>
                <a href="#"
                   id="myapp-8"
                   data-action="theme-update"
                   data-themesave
                   data-theme="/Content/css/themes/cust-theme-8.css"
                   data-toggle="tooltip"
                   data-placement="top"
                   title="Chetwode Blue"
                   data-original-title="Chetwode Blue"></a>
            </li>
            <li>
                <a href="#"
                   id="myapp-9"
                   data-action="theme-update"
                   data-themesave
                   data-theme="/Content/css/themes/cust-theme-9.css"
                   data-toggle="tooltip"
                   data-placement="top"
                   title="Apricot"
                   data-original-title="Apricot"></a>
            </li>
            <li>
                <a href="#"
                   id="myapp-10"
                   data-action="theme-update"
                   data-themesave
                   data-theme="/Content/css/themes/cust-theme-10.css"
                   data-toggle="tooltip"
                   data-placement="top"
                   title="Blue Smoke"
                   data-original-title="Blue Smoke"></a>
            </li>
            <li>
                <a href="#"
                   id="myapp-11"
                   data-action="theme-update"
                   data-themesave
                   data-theme="/Content/css/themes/cust-theme-11.css"
                   data-toggle="tooltip"
                   data-placement="top"
                   title="Green Smoke"
                   data-original-title="Green Smoke"></a>
            </li>
            <li>
                <a href="#"
                   id="myapp-12"
                   data-action="theme-update"
                   data-themesave
                   data-theme="/Content/css/themes/cust-theme-12.css"
                   data-toggle="tooltip"
                   data-placement="top"
                   title="Wild Blue Yonder"
                   data-original-title="Wild Blue Yonder"></a>
            </li>
            <li>
                <a href="#"
                   id="myapp-13"
                   data-action="theme-update"
                   data-themesave
                   data-theme="/Content/css/themes/cust-theme-13.css"
                   data-toggle="tooltip"
                   data-placement="top"
                   title="Emerald"
                   data-original-title="Emerald"></a>
            </li>
        </ul>
    </div>
	<hr class="mb-0 mt-4">
	<div class="pl-5 pr-3 py-3 bg-faded">
		<div class="row no-gutters">
			<div class="col-6 pr-1">
				<a href="#" class="btn btn-outline-danger fw-500 btn-block" data-action="app-reset">重置</a>
			</div>
			<div class="col-6 pl-1">
				<a href="#" class="btn btn-danger fw-500 btn-block" data-action="factory-reset">恢复默认</a>
			</div>
		</div>
	</div>
</div>